<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:fn="http://java.sun.com/jsp/jstl/functions"
	xmlns:p="http://primefaces.org/ui"
	lang="en">
	
	<ui:decorate template="/WEB-INF/facelets/faceletListar.xhtml">
		<ui:define name="form">
			<h:form>
				<h:panelGroup id="painelListar" rendered="#{SocioMB.modoListar}" >
					
					<span class="label label-success">Ativos: <h:outputText value="#{SocioMB.numeroAtivos}"/> </span>
					<span class="label label-important pull-right">Inativos: <h:outputText value="#{SocioMB.numeroInativos}"/> </span>
					<br/>
					<br/>
				
					<p:commandButton action="#{SocioMB.criar}" value="Novo &raquo;" ajax="false"></p:commandButton>

				    <p></p>
						
					<p:dataTable 
						value="#{SocioMB.lista}" 
						var="obj" 
						selectionMode="single" 
						selection="#{SocioMB.entidade}"
						paginator="true"
						rows="20"
						rowKey="#{obj.id}"
						widgetVar="tabela"
						emptyMessage="Nenhum registro encontrado."
						rowIndexVar="indice"
						rowStyleClass="#{obj.ativo ? null : 'label label-important'}">
					
						<p:column>
							<f:facet name="header">
						    	<h:outputText value="Nº" />
						   	</f:facet>
						    <div align="center">
						    	<h:outputText value="#{indice + 1}" />
						    </div>
						</p:column>
						
						<p:column>
				        	<f:facet name="header">
				        		<h:outputText value="Nome" />
				        	</f:facet>
				            <h:outputText value="#{obj.nome}" />
				        </p:column>
					        
				        <p:column>
				        	<f:facet name="header">
			        			<h:outputText value="E-mail" />
				        	</f:facet>
				            <h:outputText value="#{obj.email}" />
				        </p:column>
				        
				        <p:column>
				        	<f:facet name="header">
				        		<h:outputText value="Celular" />
			        		</f:facet>
				            <h:outputText value="#{obj.endereco.telefoneCelular}" />
				        </p:column>
				        
				        <p:column>
				        	<f:facet name="header">
				        	</f:facet>
				        	<div align="center">
				            	<p:commandButton value="Editar" action="#{SocioMB.editar(obj)}" ajax="false"></p:commandButton>
				            </div>
				        </p:column>
				        
				    </p:dataTable>
			</h:panelGroup>
			
			<h:panelGroup id="painelEditar" rendered="#{SocioMB.modoEditar}" >
					
					<h:messages id="mensagens" style="color:red"></h:messages>	
				
					<fieldset>
						<legend>Cadastro de Sócios</legend>
						
						<div class="row-fluid">
							<div class="span6">
								<div class="control-group">
									<h:outputLabel value="Nome:" for="nome"
										styleClass="control-label" />
									<p:inputText id="nome" value="#{SocioMB.entidade.nome}" maxlength="30"/>
								</div>
							</div>
							
						<div class="span6">
							<div class="control-group">
								<h:outputLabel value="E-mail:" for="email"
										styleClass="control-label" />
									<p:inputText id="email" value="#{SocioMB.entidade.email}" maxlength="100"/>
								</div>
							</div>
						</div>
							
						<div class="row-fluid">
							<div class="span6">
								<div class="control-group">
									<h:outputLabel value="Telefone fixo:" for="telFixo"
										styleClass="control-label" />
									<p:inputMask mask="(99) 9999-9999" id="telFixo" value="#{SocioMB.entidade.endereco.telefoneFixo}" maxlength="15" />
								</div>
							</div>
							
							<div class="span6">
								<div class="control-group">
									<h:outputLabel value="Telefone celular:" for="telCelular"
										styleClass="control-label" />
									<p:inputMask mask="(99) 9999-9999" id="telCelular" value="#{SocioMB.entidade.endereco.telefoneCelular}" maxlength="15" />
								</div>
							</div>
						</div>
							
						<div class="row-fluid">
							<div class="span6">
								<div class="control-group">
									<h:outputLabel value="Endereço:" for="endereco"
										styleClass="control-label" />
									<p:inputText id="endereco" value="#{SocioMB.entidade.endereco.logradouro}" maxlength="300"/>
								</div>
							</div>
						
							<div class="span6">
								<div class="control-group">
									<h:outputLabel value="Bairro:" for="bairro"
										styleClass="control-label" />
									<p:inputText id="bairro" value="#{SocioMB.entidade.endereco.bairro}" maxlength="100"/>
								</div>
							</div>
						</div>
							
						<div class="row-fluid">
							<div class="span6">
								<div class="control-group">
									<h:outputLabel value="CEP:" for="cep"
										styleClass="control-label" />
									<p:inputMask mask="99.999-999" id="cep" value="#{SocioMB.entidade.endereco.cep}" maxlength="10"/>
								</div>
							</div>
						
							<div class="span6">
								<div class="control-group">
									<div class="control-group">
										<h:outputLabel value="Centro Espírita:" for="centroEspirita"/>
										<p:selectOneMenu
											id="centroEspirita"
											value="#{SocioMB.entidade.centroEspirita}"
											converter="entidadeConverter">
											
											<f:selectItem itemValue="#{null}" itemLabel="-- Escolha uma opção --"></f:selectItem>
											<f:selectItems 
												value="#{SocioMB.centros}" 
												itemLabel="#{centro.nome}"
												itemValue="#{centro}"
												var="centro"/>
										</p:selectOneMenu>
										<p:commandButton value="+" onclick="janelaModal.show();" style="margin-top:-22px"/>
									</div>
								</div>
							</div>
						</div>
							
						<div class="row-fluid">
							<div class="span6">
								<h:outputLabel value="UF:" for="uf" styleClass="control-label" />
									<p:selectOneMenu id="uf" value="#{SocioMB.uf}" converter="entidadeConverter">
										<f:selectItem itemValue="#{null}" itemLabel="-- Escolha uma opção --"></f:selectItem>
										<f:selectItems 
											value="#{SocioMB.ufs}" 
											itemLabel="#{uf.nome}"
											itemValue="#{uf}"
											var="uf"/>
									<p:ajax update="cid" listener="#{SocioMB.selecionarCidade}" process="@form">
									</p:ajax>					
									</p:selectOneMenu>
							</div>	
							
							<div class="span6">
								<div class="control-group">
									<h:outputLabel value="Cidade:" for="cid" styleClass="control-label" />
									<p:selectOneMenu id="cid" value="#{SocioMB.entidade.cidade}" converter="entidadeConverter">
										<f:selectItems 
											value="#{SocioMB.cidades}" 
											itemLabel="#{cidade.nome}"
											itemValue="#{cidade}"
											var="cidade"/>
									</p:selectOneMenu>
								</div>
							</div>
						</div>
						
						<div class="row-fluid">
							<div class="span6">
								<div class="control-group">
									<h:outputLabel value="Ativo?:" for="ativo"/>
									<p:selectBooleanCheckbox id="ativo" value="#{SocioMB.entidade.ativo}" />
								</div>
							</div>
							
							<div class="span6">
								<div class="control-group">
									<h:outputLabel value="Data de nascimento:" for="nascimento"/>
									<p:inputMask id="nascimento" value="#{SocioMB.entidade.dataNascimento}" mask="99/99/9999">
										<f:convertDateTime locale="pt_BR"></f:convertDateTime>
									</p:inputMask>
								</div>
							</div>
						</div>
						
						<div class="control-group">
							<p:commandButton 
								value="Gravar" 
								action="#{SocioMB.gravar}"
								update="mensagens"
								ajax="false"/>
							<span></span>
						
							<p:commandButton 
								value="Voltar" 
								action="#{SocioMB.voltar}"
								immediate="true"
								ajax="false">
							</p:commandButton>
							
							<span></span>
								
							<p:commandButton 
								value="Excluir" 
								action="#{SocioMB.excluir}"
								rendered="#{SocioMB.exibirExcluir}"
								onclick="confirmation.show()" 
								type="button"
								ajax="false"
								styleClass="pull-right">
							</p:commandButton>
								
							<p:confirmDialog 
								id="confirmDialog" 
								message="Confimar a exclusão do registro?"  
						        header="Confirmação!" 
						        severity="alert" 
						        widgetVar="confirmation">  
						                 
					    <p:commandButton 
						       	id="confirm" 
						       	value="Sim" 
						       	oncomplete="confirmation.hide()"  
						        action="#{SocioMB.excluir}"
						        ajax="false"/>  
						        
						    <p:commandButton 
						       	id="decline" 
						       	value="Não" 
						       	onclick="confirmation.hide()" 
						       	type="button" />   
						                  
						    </p:confirmDialog>  
						</div>
					</fieldset>
				</h:panelGroup>
				<p:remoteCommand name="atualizarCentros" update="centroEspirita" action="#{SocioMB.atualizarCentros}" immediate="true"/>
			</h:form>
				<p:dialog 
					id="modalDialog" 
					header="Cadastro de Centro Espírita" 
					widgetVar="janelaModal" 
					height="400"
					width="500">  
		    			
		    			<ui:include src="/centroespirita/modal.xhtml" />  
				</p:dialog>
		</ui:define>
	</ui:decorate>
	<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-38100107-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
</html>